<template>
  <div class='noDataBox'>
    <div class="no_data" v-if="link==='data'">
      <img src="~images/logo/nodata.png" alt="" class="img">
      <div class="message">
          “暂无数据，不如”
          <span class="refresh">刷新</span>
          “试试”
      </div>
    </div>
    <div class='ruok-chat-none' v-if="link==='gift'">
      <img src="~images/logo/noGift.png" alt="" class="img">
      <p>没有收到红包记录</p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'noData',
  props: ['link'],
  data () {
    return {}
  },
  mounted () {
    this.$('.noDataBox').css('height', document.body.clientHeight - 85)
  },
  methods: {

  },
  created () {}
}
</script>
<style lang="less" rel="stylesheet/less" scoped>
.no_data {
    -ms-flex: 1 1;
    flex: 1 1;
    z-index: 1;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 80px;
    overflow: hidden;
}
.no_data .img {
    height: 152px;
}
.no_data .message {
    margin-top: 20px;
    letter-spacing: 1px;
    font-size: 14px;
}
.no_data .message .refresh {
    color: #661dac;
}
.ruok-chat-none {
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.ruok-chat-none img {
    width: 60%;
    margin: -80px 0 20px;
}
.ruok-chat-none p {
    color: #aaa;
}
</style>
